<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
    </script>
    <script>
        $(document).ready(function () {
            $("button").click(function () {
                //链
                $("#p1").css("color", "red").slideUp(2000).slideDown(2000);
            });


            //另一种写法
            $("button").click(function () {
                $("#p1").css("color", "red")
                    .slideUp(2000)
                    .slideDown(2000);
            });
        });
    </script>
</head>

<body>

    <p id="p1">菜鸟教程!!</p>
    <button>点我</button>

</body>

</html>